<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>10 属性绑定和属性的简写</title>
    <script src="../js/vue.min.js"></script>
</head>
<body>
<div id="app">
    <p>以属性访问</p>
    <img src="{{url}}" alt="以属性访问">
    <hr>

    <pre>可以直接访问vue中的数据，不需要使用{{}}</pre>
    <img v-bind:src="url"  alt="">

    <pre> v-bind简写:属性 </pre>
    <img  :src="url" :width="w" :height="h">


</div>
<script>
    let vm = new Vue({
        el: "#app",
        data() {
            return {
                url: 'https://cn.vuejs.org/images/logo.png',
                w: '200px',
                h: '100px'
            }
        }
    })
</script>
</body>
</html>